<html>

<head>

<link rel="stylesheet" href="reset-fonts-grids.css" type="text/css" media="screen" />
<link rel="stylesheet" href="sudoku.css" type="text/css" media="screen" />

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="yahoo-dom-event.js"></script>
<script src="isolace.js"></script>
<script src="sudoku-logic.js"></script>
<script src="sudoku-ui.js"></script>

<link rel="stylesheet" href="sudoku-render-color.css" type="text/css" media="screen" />
<script src="sudoku-render-color.js"></script>

<link rel="stylesheet" href="sudoku-selection-border.css" type="text/css" media="screen" />
<script src="sudoku-selection-border.js"></script>

<script type="text/javascript">
    var problem = [8,6,4,5,3,1,2,9,7,9,5,1,6,2,7,8,4,3,2,7,3,4,8,9,6,1,5,1,4,7,9,5,6,3,8,2,3,9,6,2,4,8,5,7,1,5,8,2,1,7,3,9,6,4,6,2,5,8,1,4,7,3,9,7,1,9,3,6,5,4,2,8,4,3,8,7,9,2,1,5,6];
    var mask = [2,7,11,12,15,18,21,23,26,29,31,34,35,36,39,40,44,45,46,49,51,54,56,60,62,64,67,68,73,77,78];
    var mask1 = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58,59,60,61,62,63,64,65,66,67,68,69,70,71,72,73,74,75,76,77,78,79];

$(document).ready(function () {
    $logic.initialize(problem, mask);
    $('#someDiv').append($ui.getTimerHTML(10, 610));
    $('#someDiv').append($ui.getBoardHTML(10, 10));
    $('#someDiv').append($renderer.getPalette(249, 610));
    $('#someDiv').append($renderer.getHintPalette(317, 610));
    $ui.startGame($logic);
});

</script>

<style type="text/css">
body, li, a {
    font-family: Arial, sans-serif;
    font-size: 64px;
    text-align: left;
}

</style>
</head>

<body>

<div id='someDiv' style='height: 100%; width: 100%;'>
    &nbsp;
</div>

<div style='display: block; position: absolute; top: 114; left: 610; font-size: 14px'>

<a style='font-size: 14px' href="javascript:$('#timer').toggle();">Toggle timer</a><br/>
Marker - shift 1 to shift 9<br/>
Move left - left arrow, shift tab<br/>
Move right - right arrow, tab<br/>
Move up - up arrow, shift return<br/>
Move down - down arrow, return<br/>
<br/>
Guess
<br/>
<br/>
<br/>
<br/>
Marker
</div>

</body>
</html>